<template>
  <el-tree :props="props" :load="loadNode" lazy accordion
  @node-click="nodeclick"> </el-tree>
</template>

<script>
export default {
  data() {
    return {
      props: {
        label: "name", //指定节点标签为节点对象的某个属性值
        children: "zones", //指定子树为节点对象的某个属性值
        isLeaf: "leaf", //指定节点是否为叶子节点，仅在指定了 lazy 属性的情况下生效
      },
    };
  },
  methods: {
    loadNode(node, resolve) {
      //resolve成功返回数据结果
      if (node.level === 0) {
        this.$api.getSelectCategory().then((res) => {
          console.log(res.data);
          //进入页面 获取第一层tree数据
          return resolve(res.data.result);
        });
      }
      if (node.level >= 1) {
        //点击第一层tree后请求下一层tree
        this.$api
          .getSelectCategory({
            id: node.data.cid,
          })
          .then((res) => {
            //   console.log(res.data);
            //进入页面 获取第一层tree数据
            if (res.data.status === 200) {
              return resolve(res.data.result);
            } else {
              return resolve([]);
            }
          });
      }
    },
    nodeclick(data,node){
        console.log(data,node);
        this.$emit("setTreeData",data)
    }
  },
};
</script>

<style></style>
